<template>
	<view>
		<div v-for="(vo,index) in info" class="address-list aui-margin-b-10" :key="index" v-if="index>0">
			<!-- 设置手机号和地址 -->
			<div class="info-set" @click="next(vo.store_phone)">
				<!-- 地址信息 -->
				<div style="">
					<span class="address"> {{vo.store_name}}</span>
					<span class="address"> {{vo.store_contact}}</span>
					<span class="address">{{vo.store_phone}}</span>
					<span v-if="vo.is_default=='1'"
						style="display:inline-block;width:1.8rem;height:0.9rem;background:#005A93;border-radius: 0.1rem	;font-size:16px;font-family:PingFangSC-Regular;font-weight:400;color:rgba(255,255,255,1);text-align:center;line-height:0.9rem;margin-left:0.4rem;margin-top:0.3rem">默认</span>
					<div class="address-details aui-ellipsis-2"
						style="line-height:1rem;padding-bottom:0.4rem;font-size:14px;font-family:PingFangSC;font-weight:400;color:#333;">
						{{vo.store_address}}
					</div>
				</div>

				<!-- icon 编辑/删除 -->

			</div>


		</div>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				info: []
			};
		},
		onLoad() {
			this.get_list();
		},
		methods: {
			get_list: function() {
				uni.request({
					url: '/api/Good/storeList',
					method: 'POST',
					data: {},
					success: res => {
						this.info = res.data
					}
				});
			},
			next: function(mobile) {
				uni.showModal({
					title: '托普装修基材拨打/管理电话权限申请说明',
					content: '便于您使用该功能联系客服、业务经理,我们需要申请拨打/管理电话权限',
					cancelText: "取消", // 取消按钮的文字  
					confirmText: "确认", // 确认按钮的文字  
					showCancel: true, // 是否显示取消按钮，默认为 true
					confirmColor: '#f55850',
					cancelColor: '#39B54A',
					success: (res) => {
					if(res.confirm) {  
						console.log('comfirm') //点击确定之后执行的代码
						wx.makePhoneCall({
							phoneNumber: mobile, //仅为示例，并非真实的电话号码
							success: function() {
								console.log("拨打电话成功！")
							},
							fail: function() {
								console.log("拨打电话失败！")
							}
						})
					} else {  
						console.log('cancel') //点击取消之后执行的代码
						}  
					} 
				})

				
			},
		}
	};
</script>

<style>
	.address-list {
		background-color: #ffffff;
		padding: 0 0.75rem;
	}

	.address-list-item {
		/*display: flex;*/
		display: float;
		flex-direction: row;
		justify-content: space-between;
		height: 1.8rem;
		line-height: 1.8rem;
	}

	.address-details {
		display: inline-block;
		width: 100%;
		/*height: 2rem;*/
		line-height: 1rem;
		font-size: .75rem;
		font-family: PingFangSC-Regular;
		font-weight: 400;
		color: rgba(102, 102, 102, 1);
		margin-top: .4rem;
		box-sizing: border-box;
	}

	.aui-info {
		padding: 0;
		height: 1.95rem;
	}

	.aui-btn-block {
		display: inline-block;
		width: 17.25rem;
		height: 1.95rem;
		line-height: 1.95rem;
		color: #FFFFFF;
		/*background: linear-gradient(-152deg, #ff00ff, #9b00ff);*/
		/*background: linear-gradient(270deg, #ff00ff, #9471da);*/
		/*background: linear-gradient(270deg, #ee02fd, #9972e6);*/
		background: linear-gradient(135deg, rgba(132, 229, 255, 1) 0%, rgba(107, 180, 255, 1) 100%, rgba(122, 174, 229, 1) 100%);
		border-radius: 1.55rem;
		font-size: .75rem;
		font-family: PingFangSC-Medium;
		font-weight: 500;
		margin: .25rem 0;
		margin-left: 50%;
		transform: translateX(-50%);
	}

	.btn {
		display: inline-block;
		height: 2.45rem;
		width: 100%;
		position: fixed;
		bottom: 0rem;
		background-color: #FFFFFF;
		transition: all 0.1s ease-out;
	}

	.address {
		display: inline-block;
		font-size: 16px;
		font-family: PingFangSC-Medium;
		font-weight: 500;
		color: rgba(34, 34, 34, 1);
		margin-top: .8rem;
	}

	.info-set {
		display: inline-block;
		width: 100%;
		display: flex;
		border-bottom: 1px solid rgba(238, 238, 238, 0.5);
		;
	}

	.info-set>div:nth-child(1) {
		display: inline-block;
		flex: 3;
	}

	.info-set>div:nth-child(1)>span:nth-child(1) {
		margin-right: 1.05rem;
		font-weight: 600;
	}

	.info-set>div:nth-child(2)>div {
		display: flex;
		height: 2.6rem;
		width: 100%;
		border-left: 1px solid rgba(221, 221, 221, 0.5) !important;
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
	}

	.del-edit>span:nth-child(1) {
		flex: 1;
		display: inline-block;
		width: .9rem;
		height: .9rem;
		transform: translateY(-50%);
		margin-top: 30%;
		margin-left: .75rem;
		margin-right: 1.15rem;
	}

	.del-edit>span:nth-child(2) {
		flex: 1;
		display: inline-block;
		width: .9rem;
		height: .9rem;
		transform: translateY(-50%);
		margin-top: 30%;
	}

	.moren {
		display: inline-block;
		height: 1.9rem;
		line-height: 1.9rem;
		text-align: left;
		font-size: 15px;
		font-family: PingFangSC-Regular;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
	}

	.moren img {
		/*width: 0.95rem;*/
		vertical-align: middle;
	}

	/*.aui-btn:active {
				color: #fff;
				background-color: rgba(0, 90, 147, 0.8);
			}*/

	.btn-frame {
		position: fixed;
		margin-top: 2rem;
		bottom: 1.5rem;
		text-align: center;
		width: 100%;
	}

	.aui-btn {
		display: inline-block;
		width: 17.25rem;
		height: 2.3rem;
		line-height: 2.3rem;
		color: #FFFFFF;
		/*background: linear-gradient(-152deg, #ff00ff, #9b00ff);*/
		/*background: linear-gradient(270deg, #ff00ff, #9471da);*/
		/*background: linear-gradient(270deg, #ee02fd, #9972e6);*/
		background: #005A93;
		border-radius: 0.3rem;
		font-size: .8rem;
		font-family: PingFangSC-Regular;
		font-weight: 400;
		transition: all 0.1s ease-out;
	}

	.aui-btn:active {
		color: #fff;
		background-color: rgba(0, 90, 147, 0.8);
	}
</style>